<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    
    <title>秒转时分秒</title>
    <style>
        .btn{
            height: 500px;
            width: 500px;
            margin: 100px auto;
        }
        .imglun{
            width: 50%;
            height: 50%;
        }
    </style>
  </head>
  <body>
    <div class="btn">
        <img class="imglun"src="images/1 (1).PNG">
        <text class="text"></text>
    </div>
    <script>
      // 输入秒数
      let second = prompt("请输入秒数：");
      // 计算对应时分秒
      function calculate(e) {
        let h = parseInt((e / 60 / 60) % 24);
        let m = parseInt((e / 60) % 60);
        let s = parseInt(e % 60);
        h = h < 10 ? "0" + h : h;
        m = m < 10 ? "0" + m : m;
        s = s < 10 ? "0" + s : s;
        return `计算后得到${h}小时${m}分钟${s}秒`;
      }
      // 输出结果

      let str = calculate(second);
      document.write(str);


        
      let data = [
        {
          imageSrc: "images/1 (1).jpg",
          title: "失败是通往成功的钥匙",
        },
        { imageSrc: "images/1 (2).jpg",
          title: "222222" 
        },
        { imageSrc: "images/1 (3).jpg",
          title: "333333" 
        },
        { imageSrc: "images/1 (4).jpg",
          title: "444444" 
        },
        { imageSrc: "images/1 (5).jpg",
          title: "555555" 
        },
        { imageSrc: "images/1 (6).jpg",
          title: "666666" 
        },
        { imageSrc: "images/1 (7).jpg",
          title: "777777" 
        },
        { imageSrc: "images/1 (8).jpg",
          title: "888888" 
        },
      ];
      let pic =document.querySelector('.imglun')
      let text =document.querySelector(".text")
      let i =0
      setInterval(function(){
        i++
        pic.src=data[i].imageSrc
        text.innerHTML=data[i].title
        if(i===7){i=-1}
        
      },1000)
    </script>
  </body>
</html>
